<template>
	<view class="set-page">
		<view class="set-part">
			<view class="class-name">
				<view class="name">
					<text>班级名称：</text>
				</view>
				<view class="inp">
					<input type="text" value="一(1)" />
				</view>
			</view>
			<view class="school-name">
				<view class="name">
				   <text>学校名称：</text>
				</view>
				<view class="inp">
				   <input type="text" value="育儿学校" />
				</view>
			</view>
			<view class="teacher-name">
				<view class="name">
					<text>老师名称：</text>
				</view>
				<view class="inp">
					<input type="text" value="佳佳" />
				</view>
			</view>
			<view class="teacher-phone">
				<view class="name">
					<text>联系电话：</text>
				</view>
				<view class="inp">
					<input type="text" value="1600492702" />
				</view>
			</view>
			<view class="patriarch-code">
				<view class="name">
					<text>家长邀请码：</text>
				</view>
				<view class="inp">
				    <text>A100091</text>
				</view>
			</view>
			<view class="discipline-each">
				<view class="name">
					<text>学科：</text>
				</view>
				<view class="inp">
					<radio-group class="radio-group">
						<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in radioGather" :key="item.value">
							<view class="radio-embark">
								<radio :value="item.value" :checked="item.checked" style="transform: scale(0.7)"  />
							</view>
							<view><text>{{item.value}}</text></view>
						</label>
					</radio-group>
				</view>
			</view>
		</view>
		<view class="set-save">
			<button type="primary">保存</button>
		</view>
	</view>
</template>

<script>
  export default{
	  data(){
		  return{
			  radioGather:[
				  {
					  "value":"数学",
					  "checked":true
				  },
				  {
					  "value":"语文",
					  "checked":false
				  },
				  {
					  "value":"英语",
					  "checked":false
				  }
			  ]
		  }
	  }
  }
</script>

<style lang="scss" scoped>
	page,.set-page{
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		.set-part,
		.set-save{
			flex: 1;
			display: flex;
			flex-direction: column;
			&>.class-name,
			.school-name,
			.teacher-name,
			.teacher-phone,
			.patriarch-code,
			.discipline-each{
				flex: 1;
				font-size: 32upx;
				display: flex;
				align-items: center;
				padding:0upx 30upx;
				box-sizing: border-box;
				position: relative;
				&>.name{
					width:200upx;
					padding-right:30upx;
					display: flex;
					justify-content:flex-end;
				}
				&>.inp{
					flex: 1;
					&>.radio-group{
						width: 100%;
						display: flex;
						&>.uni-list-cell{
							flex: 1;
							display: flex;
							align-items: center;
						}
					}
				}
				&::after{
					content: "";
					position: absolute;
					height: 2upx;
					width: 100%;
					background: #e6e6e6;
					bottom: 0;
					left: 0;
				}
			}
		}
		.set-save{
			justify-content: center;
			align-items: center;
			&>button{
				width: 85%;
				height: 80upx;
				font-size: 32upx;
				border:none;
				background: #409EFF;
			}
		}
	}
</style>
